import React from 'react';
import Chart from 'echarts-for-react';
import {securityOfOperation} from "../../../services/cockpit";

// let data = [
//     {
//         name: '天然气压力',
//         value: 11.84
//     }, {
//         name: '喷淋塔进水管温度',
//         value: 10.85
//     }, {
//         name: '急冷塔进出口温度',
//         value: 4.67
//     }, {
//         name: '引风机压力',
//         value: 4.18
//     }, {
//         name: '窑体压力',
//         value: 1.64
//     },
//     {
//         name: '窑尾温度',
//         value: 1.64
//     },
// ];

class MyPie extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            dataList: '',
        };
    }
    componentDidMount() {

        securityOfOperation().then(data => {
            let dataList = data.data.ret;
            this.setState({
                dataList
            })
        })
    }
    setOption = () => {
        let myOption;
        let data = this.state.dataList;
        myOption = {
            color: ['#30b1ff','#3edfd0','#06976c','#3678de','#193356','#205267'],
            tooltip : {
                trigger: 'item',
                formatter: "{b} : {c}",
            },
            series : [
                {
                    type: 'pie',
                    radius: ['40%', '70%'],
                    center: ['50%', '45%'],
                    avoidLabelOverlap: false,
                    data:data,
                    label:{
                        formatter: "{b} ({d}%)",
                        
                    },
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    },
                    labelLine:{
                        length:10,
                        lehgth2:0
                    }
                }
            ]
        };
        return myOption;
    };
    render(){
        return(
            <div>
                <Chart
                    option={this.setOption()}
                    notMerge
                    lazyUpdate
                    style={{ height: 290}}
                />
            </div>
        )
    }
}
export default MyPie;
